<template>
	<view class="container">
		<view class="cu-card">
			<view class="cu-item bg-white shadow-warp margin-tb-sm" v-for="(item, index) in coupons" :key="index">
				<image class="status_icon" :src="'/static/images/'+item.status_icon+'.png'" v-if="item.status_icon"></image>
				<view class="border-b-line">
					<view class="flex" v-if="item.status_icon == 'invalid'">
						<view class="flex-sub bg-gray padding-top-sm">
							<view class="padding-tb-lg text-center">
								<text class="text-bold text-xxlx text-white padding-top">{{ item.coupon }}</text>
								    <span class="text-sm text-white" v-if="item.type === 3">%</span>
								    <span class="text-sm text-white" v-else>元</span>
							</view>
						</view>
						<view class="flex-twice margin-lr">
							<view class="padding-tb-sm text-gray">{{ item.title }}</view>
							<view class="text-gray">有效期：{{ item.term_validity }}</view>
<!-- 							<view class="padding-tb-sm">
								<view class="text-xs text-gray">卡券只能用于投资，不能提现 </view>
							</view> -->
						</view>
					</view>
					<view class="flex" v-else>
						<view class="flex-sub padding-top-sm" style="background-color:#50A7FF;">
							<view class="padding-tb-lg text-center">
								<text class="text-bold text-xxl text-white">{{ item.coupon }}</text>
								    <span class="text-sm text-white" v-if="item.type === 3">%</span>
								    <span class="text-sm text-white" v-else>元</span>
							</view>
						</view>
						<view class="flex-twice margin-lr">
							<view class="padding-tb-sm text-black">{{ item.title }}</view>
							<view style="color: #50A7FF;">有效期：{{ item.term_validity }}</view>
<!-- 							<view class="padding-tb-sm">
								<view class="text-xs">卡券只能用于投资，不能提现 </view>
							</view> -->
						</view>
					</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				coupons: []
			}
		},
		onLoad: function(e) {
			this.helper.checkLogin();
            this.loadData();
		},
		methods: {
			loadData: function() {
				if (this.loading) return ! 1;
				this.loading = !0;
				var info = uni.getStorageSync("userinfo");
				let timestamp = this.helper.now();
				let sign = this.helper.setSign(['token='+info.token,'timestamp='+timestamp]);
				this.helper.req({
					api:"getCoupons",
					timestamp:timestamp,
					data:{token:info.token},
					header:{sign:sign},
					method:'GET',
				}).then(res=>{
					this.coupons = res.data.data.list;
				})
			}
		}
	}
</script>

<style lang="scss">
page {
    // background-color: #f1f1f1;
		color: #56595d;
		background-color: #ddeafd;
		height:100%;
}
.status_icon {
    width: 128upx;
    height: 128upx;
	position: absolute;
	right: 0;
}
.bg-gray{
	background-color: #cccccc;
}

</style>